<template>
  <!--  签收方式表单组件-->
  <div style="padding-left: 30px; margin-top: 10px">
    <div style="padding-right: 10px; margin-bottom: 20px">
      <span style="padding-right: 15px">签收方式</span>
      <el-radio-group
        v-model="curValue"
        style="padding-right: 10px"
        @change="SignTypeChange"
      >
        <el-radio-button label="0" :disabled="disabled0"
          >二要素</el-radio-button
        >
        <el-radio-button label="2" :disabled="disabled2"
          >三要素</el-radio-button
        >
        <el-radio-button label="1" :disabled="disabled1"
          >人脸识别</el-radio-button
        >
        <el-radio-button label="3" :disabled="disabled3"
          >仅微信认证</el-radio-button
        >
      </el-radio-group>
      <el-popover
        placement="top-start"
        title="签收方式"
        width="400"
        trigger="hover"
      >
        <span>微信签收: 签收人在使用微信签收时可直接对回执单进行签收</span
        ><br />
        <span>二要素：签收人在首次签收前需进行姓名及身份证号验证;</span><br />
        <span>三要素：签收人在首次签收前需进行姓名、身份证号及手机号验证;</span
        ><br />
        <span>人脸识别：签收人在首次签收前需人脸识别验证验证;</span><br />
        <i slot="reference" class="el-icon-question question"></i>
      </el-popover>
    </div>
    <!--    <el-select-->
    <!--        v-model="curValue"-->
    <!--        placeholder="请选择签收人签收方式"-->
    <!--        style="width: 100%"-->
    <!--        :disabled="disabled"-->
    <!--        @change="handleCustomerSelect"-->
    <!--    >-->
    <!--      <el-option-->
    <!--          v-for="item in options"-->
    <!--          :key="item.value"-->
    <!--          :label="item.label"-->
    <!--          :value="item.value"-->
    <!--      >-->
    <!--      </el-option>-->
    <!--    </el-select>-->
  </div>
</template>

<script>
export default {
  props: {
    value: { require: false, default: "", type: String },
    disabled: { require: false, default: false, type: Boolean },
    cCusCode: { require: false, default: "", type: String },
    CompanyId: { require: false, default: "", type: String },
  },
  data() {
    return {
      disabled0: false, //二要素禁用
      disabled1: false, //人脸识别禁用
      disabled2: false, //三要素禁用
      disabled3: false, //仅微信禁用
      curValue: "3",
      options: [
        {
          value: "3",
          label: "微信签收",
        },
        {
          value: "1",
          label: "人脸识别",
        },
        {
          value: "0",
          label: "二要素",
        },
        {
          value: "2",
          label: "三要素",
        },
      ],
    };
  },
  watch: {
    value: {
      handler(n, o) {
        this.curValue = n;
        this.$emit("input", this.curValue);
      },
      deep: true,
      immediate: true,
    },
    // cCusCode(val) {
    //   if (val) {
    //     this.getCustomerList(val)
    //   } else {
    //     this.options = []
    //   }
    // },
  },
  methods: {
    SignTypeChange(event) {
      console.log("选择签收方式概念", event, this.curValue);
      this.$forceUpdate();
      this.$emit("select", this.curValue);
      this.$emit("input", this.curValue);
    },
  },
};
</script>

<style></style>
